<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<section class="fleet_section">
<div class="container">
<div class="row">
<div class="col-sm-12">
<h1 class="bar_">Contrary to popular belief</h1>
<h3>Latin professor at Hampden-Sydney College in Virginia</h3>
<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which don't look even slightly believable. If you are going to use a passage of Lorem Ipsum, you need to be sure there isn't anything embarrassing hidden in the middle of text. All the Lorem Ipsum</p>
</div>
</div>
</div>
<div class="container">
<div class="col-xs-12">
<div id="myCarousel" class="carousel slide text-right">
<div class="pull-right">
<ul style="margin:0px;" class="control-box pager">
<li><a class="" href="#myCarousel" data-slide="prev"><i class="glyphicon glyphicon-chevron-left"></i></a></li>
<li><a class="" href="#myCarousel" data-slide="next"><i class="glyphicon glyphicon-chevron-right"></i></a></li>
</ul>
</div>
<div class="carousel-inner">
<div class="item">
<div class="row">
<div class="col-sm-8">
<img class="img-responsive" alt="car1" src="https://image.freepik.com/free-photo/girl-looking-at-the-horizon_1150-6.jpg">
</div>
<div class="col-sm-4">
<h3>Contrary to popular belief</h3>
<h4>Hampden-Sydney College in Virginia</h4>
<p>Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. </p>
<a href="#" class="btn btn-default">Book Now</a>
</div>
</div>
</div><!-- /Slide1 -->
<div class="item">
<div class="row">
<div class="col-sm-8">
<img alt="car2" class="img-responsive" src="https://image.freepik.com/free-photo/girl-looking-at-the-horizon_1150-6.jpg">
</div>
<div class="col-sm-4">
<h3>Contrary to popular belief</h3>
<h4>Hampden-Sydney College in Virginia</h4>
<p>Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. </p>
<a href="#" class="btn btn-default">Book Now</a>
</div>
</div>
</div><!-- /Slide1 -->
<div class="item active">
<div class="row">
<div class="col-sm-8">
<img alt="car3" class="img-responsive" src="https://image.freepik.com/free-photo/girl-looking-at-the-horizon_1150-6.jpg">
</div>
<div class="col-sm-4">
<h3>Contrary to popular belief</h3>
<h4>Hampden-Sydney College in Virginia</h4>
<p>Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. </p>
<a href="#" class="btn btn-default">Book Now</a>
</div>
</div>
</div><!-- /Slide1 -->
</div>
<!-- /.control-box -->
</div><!-- /#myCarousel -->
</div><!-- /.col-xs-12 -->
</div><!-- /.container -->
</section>
section {
display: block;
float: left;
padding: 70px 0;
width: 100%;
}
h1.bar_, .fleet_section h3 {
position: relative;
}
.location_section h1, .location_section h3, .service_section h1, .service_section h3, .fleet_section h1, .fleet_section h4, .fleet_section h3 {
color: #000;
}
body {
color: #888888;
font-family: "Exo 2",sans-serif;
font-size: 14px;
line-height: normal;
}
.fleet_section .carousel {
margin-top: 40px;
}
.fleet_section .pager li > a, .fleet_section .pager li > span {
border-radius: 0;
color: #000;
}
.pager li > a:focus, .pager li > a:hover {
background: #dfa466 none repeat scroll 0 0;
color: #fff;
}
$('.carousel').carousel({
interval: 10000
})
